{extend name="template/base" /}
{block name="content"}
<style>

    .text-c{}
    .text-c td{border-left:none;}
    .text-c td input {width:15px;height:15px;}
    .open{position:relative;font-size:25px;}
    .open span{width:50%;height:50%;display:inline-block;border-bottom:1px #999 solid;border-left:1px #999 solid;position:absolute;right:0;top:0;}
    .open i {height:100%;width:50%;border-left:1px #999 solid;float:right;display:inline-block;position:absolute;right:0;}
    .open div{height:30%;width:50%;position:absolute;right:0;bottom:0;border-left:1px #999 solid;}
    .box{border:1px #ccc solid;width:100%;display:inline-block;}
    .delete{font-size:15px;font-weight:600;background:#eee;width:15px;height:15px;border-radius:50%;line-height:12px;cursor:pointer;position:absolute;right:-5px;top:-5px;}
    .box .title{background:#eee;padding:0 20px;line-height:30px;}
    .listBox{width:100%;margin-right:-20px;display:inline-block;}
    .listBox .list{
        font-size:14px;
        color:#020202;
        background:#f5f5f5;
        border-radius:10px;
        width:138px;
        display:inline-block;
        float:left;
        margin:20px;
        text-align:center;
        position:relative;
    }
    .listBox .list span{margin:5px 0;width:60px;display:inline-block;}
    .submits {border-top:1px #ccc solid;width:100%;background:#eee;height:40px;padding:5px 0;}
    .submits button{background:#5a98dd;font-size:15px;border-radius:5px;border:none;width:50px;height:30px;line-height:30px;color:#fff;margin:0 auto;display:block;cursor:pointer;}
    .submits button:hover{background:#0a6998;}
    .selected_box{
        background:#fbdddd!important;
    }
</style>
<br><br><br>
<div class="page-container">
    <form class="mb-20" method="get" action="{:\\think\\Url::build($Request.action)}">
        <input type="text" autocomplete="off" class="input-text" style="width:250px" placeholder="开始时间" name="start_time" value="{$Request.param.start_time}" {literal} onfocus="WdatePicker({dateFmt: 'yyyy-MM-dd'})" {/literal}>
        <input type="text" autocomplete="off" class="input-text" style="width:250px" placeholder="结束时间" name="end_time" value="{$Request.param.end_time}" {literal} onfocus="WdatePicker({dateFmt: 'yyyy-MM-dd'})" {/literal}>
        <div class="select-box" style="width:250px">
            <select name="platform" class="select">
                <option value="3">请选择平台</option>
                {foreach $platform as $vo9}
                    <option value="{$vo9.platform_name}">{$vo9.name}</option>
                {/foreach}
            </select>
        </div>
        <input type="text" class="input-text" autocomplete="off" style="width:250px" placeholder="住宿备注" name="remark" value="{$Request.param.remark}" >
        <input type="text" class="input-text" autocomplete="off" style="width:250px" placeholder="请输入订单id" name="order_id" value="{$Request.param.order_id}" >
        <input type="text" class="input-text" autocomplete="off" style="width:250px" placeholder="请输入联系电话" name="phone" value="{$Request.param.phone}" >
        <input type="text" class="input-text" autocomplete="off" style="width:250px" placeholder="请输入旅客姓名" name="name" value="{$Request.param.name}" >
        <input type="text" class="input-text" autocomplete="off" style="width:250px" placeholder="请输入预订人姓名" name="booking_people_name" value="{$Request.param.booking_people_name}" >
        <input type="text" class="input-text" autocomplete="off" style="width:250px" placeholder="请输入预订人手机号码" name="booking_people_phone" value="{$Request.param.booking_people_phone}" >
        <button type="submit" class="btn btn-success"><i class="Hui-iconfont">&#xe665;</i> 搜索</button>
    </form>
    <div class="cl pd-5 bg-1 bk-gray">
        <span class="l">
            <!--{tp:menu menu="add,delete" /}-->
            <a class="btn btn-primary radius mr-5" id="sou" href="{:url('/admin/accommodation/get_excel',$searchCondition)}" >excel导出</a>
            <a class="btn btn-primary radius mr-5" id="xuan" style="display: none;"  href="javascript:;" onclick="xuan()">excel导出</a>
        </span>
        <span class="r pt-5 pr-5">
            共有数据 ：<strong>{$count ?? '0'}</strong> 条
        </span>
    </div>
    {php}use think\Db;{/php}
    <table class="table table-border table-bordered table-hover table-bg mt-20">
        <thead>
        <tr class="text-c">
            <th width="25"><input type="checkbox" id="checkAlls"></th>
            <th></th>
            <th width="">ID</th>
            <th width="">订单id</th>
            <th width="">分组id</th>
            <th width="">产品</th>
            <th width="">标题</th>
            <th width="">预订人</th>
            <th width="">预订人电话</th>
            <th width="">订单处理状态</th>
            <th width="">旅游路线</th>
            <th width="">旅客姓名</th>
            <th width="">联系电话</th>
            <th width="">年龄</th>
            <th width="">身份证</th>
            <th width="">性别</th>
            <th width="">平台</th>
            <th width="">客人数量</th>
            <th width="">开始时间</th>
            <th width="">结束时间</th>
            <th width="">是否住宿</th>
            <th width="">住宿备注</th>
        </tr>
        </thead>
        <tbody>
        {volist name="list" id="vo"}
        <tr class="text-c">
            {php}
                if($order_id != $vo['order_id']){
                    $i = 0;
                }
            {/php}
            {php} $order_id = $vo['order_id']{/php}
            <td><input type="checkbox" name="id[]" value="{$vo.id}"></td>
            <td class="open">
                {if condition="$vo.show_mian"}
                <p>+</p><div></div>
                {elseif  condition="$vo.show_between" /}
                <span></span><i></i>
                {elseif  condition="$vo.show_end" /}
                <span></span>
                {/if}
            </td>
            <td>{$vo.id|high_light=$Request.param.id}</td>
            <td>{$vo.order_no|high_light=$Request.param.order_no}:{$vo.sku_name}</td>
            <td>
                {$vo.group_id|high_light=$Request.param.group_id}
            </td>
            <td>
                {$vo.sales_id|high_light=$Request.param.sales_id}
            </td>
            <td>{$vo.title}</td>
            <td>{$vo.booking_people_name}</td>
            <td>{$vo.booking_people_phone}</td>
            <td>
                {$vo.order_processing_status}
            </td>
            <td>
                {$vo.route_name}
            </td>
            <td>
                {$vo.name}
            </td>
            <td>
                {$vo.phone}
            </td>
            <td>
                {$vo.age}
            </td>

            <td>
                {$vo.id_card}
            </td>
            <td>
                {$vo.sex}
            </td>
            <td>
                {$vo.platform}
            </td>
            <td>
                {$vo.num}
            </td>
            <td>
                {$vo.start_time}
            </td>
            <td>
                {$vo.end_time}
            </td>
            <td>
                {$vo.isaccommodation}
            </td>
            <td>
                {$vo.accommodation}
            </td>
            <td class="f-14">

            </td>

        </tr>
        {/volist}
        </tbody>
    </table>
    <div class="page-bootstrap">{$page ?? ''}</div>
</div>
{/block}
{block name="script"}
<script type="text/javascript" src="__LIB__/My97DatePicker/WdatePicker.js"></script>
<script>
    $(function () {
        $("[name='is_accommodation']").find("[value='{$Request.param.is_accommodation}']").attr("selected", true);
    })
</script>

<script>
    //全选
    $('#checkAlls').bind("click", function () {
        $("input[name='id[]']").prop("checked",this.checked);
        var sonChecked = $("input[name='id[]']").prop('checked');
        var allChecked = this.checked
        if (sonChecked && allChecked){
            $('#xuan').css('display','inline') // 显示选择excel导出数据
            $('#sou').css('display','none') // 隐藏部分或全部excel导出数据
        }else{
            $('#xuan').css('display','none')
            $('#sou').css('display','inline')
        }
        // console.log('你点击我了')
        // console.log('你是否被选中', this.checked)
        // console.log('下级的选框', $("input[name='id[]']").prop('checked'))
    });

    // 单选
    $("input[name='id[]']").bind('click', function () {
        var radioData =  $("input:checked[name='id[]']");
        // 选择数据的长度
        var len = radioData.serializeArray().length;
        if (len > 0) {
            $('#xuan').css('display','inline') // 显示选择excel导出数据
            $('#sou').css('display','none') // 隐藏部分或全部excel导出数据
        } else {
            $('#xuan').css('display','none')
            $('#sou').css('display','inline')
            $('#checkAlls').prop('checked',false); // 取消选择全选按钮
        }
        // console.log('你点击了单选')
        // console.log('点击的结果为：', this.checked)
        // console.log('你选择的数据是', radioData.serializeArray())
        // console.log('你选择的数据长度是',len)
    });

    function xuan() {
        var checkData = $("input:checked[name='id[]']");
        var dataArr = checkData.serializeArray();
        dataArr.push({name: 'search',value: 'all'})
        // console.log('选择的数据是', checkData.length)
        // console.log('选择的数据是', checkData.serializeArray())
        // console.log('选择的数组是', dataArr)
        $.ajax({
            type: 'post',
            url: '/admin/accommodation/get_excel',
            data: dataArr,
            success: function (res) {
                if (res.code == 5){
                    // console.log('data', res);
                    location.href = res.msg; // 下载文件
                    // 删除文件
                    unclinkFile(res.msg)
                    layer.msg('导出数据成功');
                } else {
                    layer_open('excel导出数据','/admin/pub/role/id/1')
                }
            }
        });
    }
    var  value = 1;
    setTimeout(unclinkFile,1200000,value); // 延迟20分钟1200000
    // 15分钟后删除文件-900000
    function unclinkFile(val) {
        console.log(val)
        setTimeout(function () {
            // 删除文件
            $.ajax({
                type: 'post',
                url: '/admin/order/del',
                data: {val:val},
                success: function (data) {
                    console.log('data', data)
                    if (data.code != 5) {
                        console.log('删除失败', data.msg)
                    }
                }
            })
        },120000,val); // 2分钟后执行
    }
</script>
{/block}

